{% extends 'base.html' %}

{% block title %}个人资料 - 校园技能交换平台{% endblock %}

{% block content %}
<div class="row">
    <div class="col-md-4">
        <div class="card">
            <div class="card-header">
                <h4 class="card-title mb-0">个人信息</h4>
            </div>
            <div class="card-body">
                <ul class="list-unstyled">
                    <li class="mb-3">
                        <strong>用户名：</strong>
                        {{ user.username }}
                    </li>
                    <li class="mb-3">
                        <strong>邮箱：</strong>
                        {{ user.email }}
                    </li>
                    <li class="mb-3">
                        <strong>用户类型：</strong>
                        {{ user.get_user_type_display }}
                    </li>
                    <li class="mb-3">
                        <strong>学号/工号：</strong>
                        {{ user.student_id }}
                    </li>
                    <li class="mb-3">
                        <strong>学院：</strong>
                        {{ user.college }}
                    </li>
                    <li class="mb-3">
                        <strong>专业/部门：</strong>
                        {{ user.major }}
                    </li>
                </ul>
                <div class="mt-3">
                    <h5>个人简介</h5>
                    <p>{{ user.bio|default:"暂无简介"|linebreaks }}</p>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-8">
        <div class="card mb-4">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h4 class="card-title mb-0">我的技能</h4>
                <a href="{% url 'listings:skill_create' %}" class="btn btn-primary btn-sm">发布技能</a>
            </div>
            <div class="list-group list-group-flush">
                {% for skill in skills %}
                <a href="{% url 'listings:skill_detail' skill.pk %}" class="list-group-item list-group-item-action">
                    <div class="d-flex w-100 justify-content-between">
                        <h5 class="mb-1">{{ skill.title }}</h5>
                        <small class="text-muted">{{ skill.created_at|date:"Y-m-d" }}</small>
                    </div>
                    <p class="mb-1 text-truncate">{{ skill.description }}</p>
                    <small class="text-muted">
                        分类: {{ skill.get_category_display }} | 
                        回报: {{ skill.get_reward_type_display }}
                    </small>
                </a>
                {% empty %}
                <div class="list-group-item">
                    <p class="mb-0">您还没有发布任何技能。<a href="{% url 'listings:skill_create' %}">立即发布</a></p>
                </div>
                {% endfor %}
            </div>
        </div>

        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h4 class="card-title mb-0">我的需求</h4>
                <a href="{% url 'listings:need_create' %}" class="btn btn-primary btn-sm">发布需求</a>
            </div>
            <div class="list-group list-group-flush">
                {% for need in needs %}
                <a href="{% url 'listings:need_detail' need.pk %}" class="list-group-item list-group-item-action">
                    <div class="d-flex w-100 justify-content-between">
                        <h5 class="mb-1">{{ need.title }}</h5>
                        <small class="text-muted">{{ need.created_at|date:"Y-m-d" }}</small>
                    </div>
                    <p class="mb-1 text-truncate">{{ need.description }}</p>
                    <small class="text-muted">
                        分类: {{ need.get_category_display }} | 
                        期望: {{ need.get_preferred_solution_display }} |
                        状态: {% if need.is_resolved %}已解决{% else %}待解决{% endif %}
                    </small>
                </a>
                {% empty %}
                <div class="list-group-item">
                    <p class="mb-0">您还没有发布任何需求。<a href="{% url 'listings:need_create' %}">立即发布</a></p>
                </div>
                {% endfor %}
            </div>
        </div>
    </div>
</div>
{% endblock %} 